import React, {Component} from 'react'
import UserPageTemplate from './userPageTemplate'
import {Checkbox, Form, Input} from 'antd'
import Iconfont from '../../utils/iconfont'
import DragValidate from '../common/dragValidate'
import commonConfig from '../../static/js/commonConfig'
import store from '../../store'

/* eslint-disable */
class LoginApp extends Component {
    state = {
        status: false,
        weChartLogin: false
    }

    initWeChart = () => {
        commonConfig.ajaxNoFileMethods('weixin/getBack', null, msg => {
            window.WwLogin({
                id: 'WeChart',
                ...msg,
                state: 'login'
            });
        });
    }

    onFinish = values => {
        // values.password = RSAUtils.encryptedString(RSAUtils.publicKey, values.password)
        // commonConfig.ajaxNoFileMethods('user/login', values, msg => {
        //     commonConfig.messageCustomService(msg, result => {
        //         if (result) {
        //             const {data, user} = msg.data;
        //             commonConfig.setCookies(data);
        //             commonConfig.setCookies({userInfo: user});
        //             commonConfig.redirectPage(this, 'homePage');
        //         }
        //         store.dispatch({type: 'isLogin', payload: result});
        //     })
        // }, null, null, null, true);
        commonConfig.setCookies({ isLogin: true });
        store.dispatch({type: 'isLogin', payload: true});
        commonConfig.redirectPage(this, 'homePage');
    }

    dragSuccess = (status) => {
        this.setState({status}, () => {
            this.refs.userPageRef.refs.userRef.validateFields();
        });
    }

    loginSelectHandle = () => {
        this.setState({weChartLogin: !this.state.weChartLogin}, () => {
            if (this.state.weChartLogin) {
                this.initWeChart();
            }
        })
    }

    render() {
        const {status, weChartLogin} = this.state;
        const userPageTemplateProps = {
            ...this.props,
            isLogin: true,
            tipObj: {
                title: 'New here?',
                en: 'If you don\'t have any accounts, please register now',
                info: '如果你还没有账号，请立即注册'
            },
            onFinish: this.onFinish,
            weChartLogin,
            loginSelectHandle: this.loginSelectHandle
        }
        const layout = {
            labelCol: {
                span: 0
            },
            wrapperCol: {
                span: 24
            }
        }
        return (
            <>
                <UserPageTemplate ref="userPageRef" {...userPageTemplateProps}>
                    {!weChartLogin ?
                        <>
                            <Form.Item {...layout} name="accunt" rules={[{required: true, message: '请输入用户名'}]}>
                                <Input addonBefore={<Iconfont type="icon-yonghu"/>} placeholder="请输入用户名"
                                       autocomplate="off"/>
                            </Form.Item>
                            <Form.Item {...layout} name="password" rules={[{required: true, message: '请输入密码'}]}>
                                <Input.Password addonBefore={<Iconfont type="icon-ziyuanxhdpi"/>}
                                                placeholder="请输入密码"
                                                autocomplate="off"/>
                            </Form.Item>
                            <Form.Item {...layout} name="slide" className="slide_validate"
                                       rules={[{message: ''}, () => ({
                                           validator: () => {
                                               if (status) {
                                                   return Promise.resolve();
                                               }
                                               return Promise.reject('请拖动滑动条来进行验证');
                                           }
                                       })]}>
                                <DragValidate success={this.dragSuccess}/>
                            </Form.Item>
                            <Form.Item {...layout} className="checked_pwd">
                                <Checkbox>记住密码</Checkbox>
                            </Form.Item>
                        </> :
                        <Form.Item {...layout} className="we_chart_login">
                            <div id="WeChart" className="WeChart"/>
                        </Form.Item>
                    }
                </UserPageTemplate>
            </>
        )
    }
}

export default LoginApp